"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
const fs = __importStar(require("fs"));
const path_1 = __importDefault(require("path"));
const dropdown_menu_1 = __importDefault(require("../../OtherCompoents/dropdown_menu/dropdown_menu"));
const lib_css_1 = __importDefault(require("../../../../../../@libs/nodejs-lib-main/lib_css"));
const component = {
    name: 'nav_menu',
    props: {
        isOpenPlayDemo: false,
        treeData: Object || String,
        lf: Object || String,
    },
    template: fs.readFileSync(`${__dirname}/nav_menu.html`, "utf-8"),
    components: { DropDown: dropdown_menu_1.default },
    setup() {
    },
    methods: {
        $_reset(node_id) {
            const properties = this.$props.lf.getDataById(node_id);
            const { transformModel } = this.$props.lf.graphModel;
            // transformModel.translate(properties.x, properties.y);
            transformModel.focusOn(properties.x, properties.y, 1500, 950);
            this.$props.lf.selectElementById(node_id, false);
        },
        originTreeList(data) {
            const dataSelectList = new Map([
                ["dataFlow", 0],
                ["characterLibrary", 1],
                ["character", 2],
                ["locationLibrary", 3],
                ["location", 4],
                ["rewardVariable", 5],
                ["project", 6], //奖励
            ]);
            this.$emit('changePanel', dataSelectList.get(data.type));
            if (data.id) {
                this.$_reset(data.id);
            }
        },
        playDemoTreeList(data) {
            console.log("data演示", data);
            if (data.type != 'project') {
                this.$emit('changePlayDemoPanel', data.id);
            }
        },
        handleNodeClick(data) {
            //点击角色库
            console.log("data", data);
            if (this.$props.isOpenPlayDemo) {
                this.playDemoTreeList(data);
            }
            else {
                this.originTreeList(data);
            }
        },
        dragPic() {
            // 获取节点信息，创建图片元素
            const img = document.createElement('img');
            img.src = 'F:/Cocos项目相关/cocos项目/dialogue/extensions_dev/plotcraft/src/background/add_user.png'; // 假设节点数据中有图片的URL
            // 设置图片位置
            img.style.position = 'absolute';
            img.style.left = `${this.mouse.left}px`;
            img.style.top = `${this.mouse.top}px`;
            img.style.width = '30px';
            img.style.height = '30px';
            // 将图片添加到页面中
            document.body.appendChild(img);
        },
        onMouseDown(event) {
            console.log("按下");
            this.$data.isDragging = true;
            const dragTarget = document.getElementById('dragtarget');
            document.addEventListener('mousemove', this.onMouseMove);
            document.addEventListener('mouseup', this.onMouseUp);
        },
        onMouseMove(event) {
            console.log("lf", this.$props.lf);
            console.log("lf.graphModel", this.$props.lf.graphModel);
            console.log("lf.nodes", this.$props.lf.graphModel.nodesMap);
            console.log("移动");
            const dragTarget = document.getElementsByTagName('img')[0];
            console.log("dragTarget", document.getElementsByTagName('img'));
            if (this.$data.isDragging && !dragTarget) {
                console.log("不存在");
                const img = document.createElement('img');
                img.src = 'F:/Cocos项目相关/cocos项目/dialogue/extensions_dev/plotcraft/src/background/add_user.png'; // 假设节点数据中有图片的URL
                // 设置图片位置
                img.style.position = 'absolute';
                img.style.width = '30px';
                img.style.height = '30px';
                // 将图片添加到页面中
                document.body.appendChild(img);
            }
            else if (this.$data.isDragging && dragTarget) {
                // 获取节点信息，创建图片元素
                dragTarget.style.left = `${this.mouse.left + 20}px`;
                dragTarget.style.top = `${this.mouse.top}px`;
                this.detectBounding(event);
            }
        },
        //检测包围盒
        detectBounding(event) {
            // 获取所有SVG元素
            const svgElements = document.querySelectorAll('rect');
            // 获取SVG元素
            var svgElement = document.querySelector('rect[type="location"]');
            console.log("event", event);
            console.log("svgElement", svgElement);
            if (svgElement) {
                // 获取鼠标坐标
                var mouseX = event.clientX;
                var mouseY = event.clientY;
                console.log("mouseX ", mouseX);
                console.log("mouseY ", mouseY);
                // 获取SVG元素的边界框信息
                var svgRect = svgElement.getBoundingClientRect();
                console.log("svgRect", svgRect);
                // 判断鼠标坐标是否在SVG元素内
                if (mouseX >= svgRect.left &&
                    mouseX <= svgRect.right &&
                    mouseY >= svgRect.top &&
                    mouseY <= svgRect.bottom) {
                    // 鼠标在SVG元素内
                    console.log('鼠标在SVG元素内');
                }
                else {
                    // 鼠标不在SVG元素内
                    console.log('鼠标不在SVG元素内');
                }
            }
        },
        onMouseUp(event) {
            console.log("鼠标弹起");
            this.$data.isDragging = false;
            document.removeEventListener('mousemove', this.onMouseMove);
            // 获取所有img元素
            const imgElement = document.getElementsByTagName('img')[0];
            // 移除所有img元素
            if (imgElement) {
                imgElement.remove();
            }
        },
        rightMenu(e) {
            console.log("待测试", e);
            // this.$data.isPop = true;
            // this.$data.mouse.left = e.pageX;
            // this.$data.mouse.top = e.pageY;
            // document.addEventListener("click", () => {
            //   this.isPop = false;
            // });
        },
        // 获取鼠标位置
        updateMousePosition(event) {
            this.mouse = { left: event.clientX, top: event.clientY };
        }
    },
    data() {
        return {
            isPop: false,
            isDragging: false,
            defaultProps: {
                children: 'children',
                label: 'label',
            },
            mouse: {
                left: 0,
                top: 0
            },
        };
    },
    watch: {
        treeData: function (newValue, oldValue) {
            //数据变化时
            console.log("newValue", JSON.stringify(newValue));
            console.log("oldValue", JSON.stringify(oldValue));
        }
    },
    created() { },
    mounted() {
        // 监听鼠标移动事件，更新鼠标位置
        document.addEventListener('mousemove', this.updateMousePosition);
        lib_css_1.default.load([
            {
                parent: this.$el,
                url_s: path_1.default.join(`${__dirname}/nav_menu.css`),
            },
        ]);
    },
    beforeDestroy() {
        // 在组件销毁前移除鼠标移动事件监听
        document.removeEventListener('mousemove', this.updateMousePosition);
    }
};
module.exports = component;
